import 'package:flutter/material.dart';

class StackDemo extends StatelessWidget {
  const StackDemo({super.key});

  @override
  Widget build(BuildContext context) {
    var yellowBox = Container(
      color: Colors.yellow,
      height: 100,
      width: 100,
    );

    var redBox = Container(
      color: Colors.red,
      height: 90,
      width: 90,
    );

    var greenBox = Container(
      color: Colors.green,
      height: 80,
      width: 80,
    );

    return Scaffold(
      appBar: AppBar(
        title: const Text(
          'Stack'
        ),
      ),
      body: Container(
        width: 200,
        height: 120,
        color: Colors.grey.withAlpha(33),
        child: Stack(
          textDirection: TextDirection.rtl,
          fit: StackFit.loose,
          alignment: Alignment.topCenter,
          // children: <Widget>[
          //   yellowBox,
          //   redBox,
          //   Positioned(
          //     bottom: 10,
          //     right: -30,
          //     child: greenBox,
          //   ),
          // ],
          children: <Widget>[
            yellowBox,
            greenBox,
            Align(
              alignment: const Alignment(-1, 0),
              child: redBox,
            ),
          ],
        ),
      ),
    );
  }
}